import 'package:cbec_app/components/base/base_image.dart';
import 'package:cbec_app/components/base/base_interactive.dart';
import 'package:cbec_app/components/base/base_nav_bar.dart';
import 'package:cbec_app/components/base/base_page.dart';
import 'package:cbec_app/components/common/common_style.dart';
import 'package:cbec_app/pages/my/controller/redpack_ctr.dart';
import 'package:cbec_app/utils/Tools.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

//购券中心
class RedPackMarket extends StatelessWidget {
  RedPackMarket({super.key});

  final RedPackController controller = Get.put(RedPackController());

  @override
  Widget build(BuildContext context) {
    return Obx(() => BasePage(
          title: "购券中心",
          iconType: IconType.back,
          enablePullDown: true,
          enablePullUp: true,
          refreshController: controller.freshCtr,
          onPageLoading: controller.onMarketPageLoading,
          onPageRefresh: controller.onMarketPageRefresh,
          children: [
            Container(
              padding: const EdgeInsets.only(top: 10, bottom: 10),
              alignment: Alignment.center,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  MaterialButton(
                      shape: RoundedRectangleBorder(
                        //边框颜色
                        side: BorderSide(
                          color: controller.isCouponsCenter.value ? Colors.white : Colors.red,
                          width: 1,
                        ),

                        //边框圆角
                        borderRadius: const BorderRadius.only(topLeft: Radius.circular(20), bottomLeft: Radius.circular(20)),
                      ),
                      color: controller.isCouponsCenter.value ? Colors.white : Colors.red,
                      child: Text('领券中心', style: TextStyle(color: controller.isCouponsCenter.value ? Colors.black : Colors.white)),
                      onPressed: () {
                        controller.queryCanClaimedRedPacketList();
                      }),
                  MaterialButton(
                    color: controller.isCouponsCenter.value ? Colors.red : Colors.white,
                    shape: RoundedRectangleBorder(
                      //边框颜色
                      side: BorderSide(
                        color: controller.isCouponsCenter.value ? Colors.red : Colors.white,
                        width: 1,
                      ),

                      //边框圆角
                      borderRadius: const BorderRadius.only(topRight: Radius.circular(20), bottomRight: Radius.circular(20)),
                    ),
                    child: Text(
                      '购券中心',
                      style: TextStyle(color: controller.isCouponsCenter.value ? Colors.white : Colors.black),
                    ),
                    onPressed: () {
                      controller.getRedpackGoodsList();
                    },
                  ),
                ],
              ),
            ),
            Container(
              padding: const EdgeInsets.only(left: 8, right: 8, top: 0, bottom: 0),
              child: Wrap(
                spacing: 10,
                runSpacing: controller.isCouponsCenter.value == true ? 8 : 0,
                children: List.generate(controller.isCouponsCenter.value ? controller.goodsList.length : controller.qccrepGoodsList.length, (index) {
                  final Map item = controller.isCouponsCenter.value ? controller.goodsList[index] : controller.qccrepGoodsList[index];
                  return SizedBox(
                    width: controller.isCouponsCenter.value == true ? (ScreenUtil().screenWidth - 26) / 2 : ScreenUtil().screenWidth - 16,
                    child: RedpackGoodsItem(item: item),
                  );
                }),
              ),
            ),
            emptyMargin(70.h),
            Positioned(
              key: GlobalKey(debugLabel: 'Positioned'),
              bottom: 0,
              child: Container(
                color: Tools.fromHex("#F3F5F7"),
                padding: EdgeInsets.fromLTRB(18.w, 10.w, 18.w, 10.w),
                width: 375.w,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Container(
                      width: 240.w,
                      height: 38.h,
                      padding: EdgeInsets.only(left: 10.w, top: 10.w),
                      decoration: border_radis(Colors.white, radiusValue: 5.w),
                      child: TextFormField(
                        controller: controller.codetxtController,
                        decoration: descript("请输入兑换码", fontsize: 16),
                      ),
                    ),
                    solidButton("确认", width: 72.w, radius: 40.w, () {
                      controller.exchange();
                    })
                  ],
                ),
              ),
            ),
          ],
        ));
  }
}

class RedpackGoodsItem extends StatelessWidget {
  final Map item;

  RedpackGoodsItem({super.key, required this.item});

  final RedPackController controller = Get.put(RedPackController());

  @override
  Widget build(BuildContext context) {
    return BaseInteractive(
      onClick: () {
        controller.isCouponsCenter.value == true ? controller.orderDetail(item) : controller.receiveRedPack(item['redPacketId']);
      },
      childWidget: controller.isCouponsCenter.value ? getRedPackWidget() : queryCanClaimedRedPacketWidget(),
    );
  }

  Widget getRedPackWidget() {
    return Container(
      decoration: border_radis(Colors.white, radiusValue: 8),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisSize: MainAxisSize.min,
        children: [
          //图
          ClipRRect(
            borderRadius: const BorderRadius.only(topLeft: Radius.circular(8), topRight: Radius.circular(8)),
            child: Container(
              decoration: border_radis(Colors.white),
              height: (ScreenUtil().screenWidth - 26) / 2,
              width: (ScreenUtil().screenWidth - 26) / 2,
              child: BaseImage(url: item['mainImage'], fit: BoxFit.cover),
            ),
          ),
          SizedBox(height: 8.w),
          Row(
            children: [
              Flexible(
                child: Container(
                  padding: EdgeInsets.only(left: 10.w),
                  child: Text(
                    item['commodityName'],
                    style: setTextStyle(12, FontWeight.w300, Tools.fromHex("#333333")),
                    maxLines: 2, // 限制最多显示2行
                    overflow: TextOverflow.ellipsis, // 超出部分显示省略号
                    softWrap: true, // 允许换行
                  ),
                ),
              ),
            ],
          ),

          SizedBox(height: 8.w),
          Container(
            padding: EdgeInsets.only(left: 10.w, right: 10.w, bottom: 10.w),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Row(
                  children: [
                    Text(
                      "￥",
                      style: setTextStyle(10, FontWeight.w700, Tools.fromHex("#F83F2D")),
                    ),
                    Text("${item['price'].toString().split(".")[0]}.", style: setTextStyle(15, FontWeight.w700, Tools.fromHex("#F83F2D"))),
                    Text(item['price'].toString().split(".")[1], style: setTextStyle(10, FontWeight.w700, Tools.fromHex("#F83F2D"))),
                    Text("到手价", style: setTextStyle(12, FontWeight.w300, Tools.fromHex("#F83F2D"))),
                  ],
                ),
                //Text("￥${item['priceMarket']}", style: setTextStyle(10, FontWeight.w300, Tools.fromHex("#999999")))
              ],
            ),
          ),
          Container(
            margin: EdgeInsets.fromLTRB(10.w, 0.w, 4.w, 5.w),
            padding: EdgeInsets.fromLTRB(4.w, 2.w, 4.w, 2.w),
            decoration: border_radis(Tools.fromHex("#FFEEEE"), radiusValue: 5.w),
            child: Text(
              "卡券",
              style: setTextStyle(
                10,
                FontWeight.w300,
                Tools.fromHex("#F83F2D"),
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget queryCanClaimedRedPacketWidget() {
    // return Placeholder();
    return Column(
      mainAxisAlignment: MainAxisAlignment.start,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Container(
            decoration: const BoxDecoration(
              color: Colors.transparent,
              image: DecorationImage(
                image: AssetImage("assets/images/redpack_bg.png"),
                fit: BoxFit.cover,
              ),
            ),
            // constraints: BoxConstraints(maxHeight: 200.w),
            margin: EdgeInsets.only(top: 10.w),
            padding: EdgeInsets.only(top: 5.w, bottom: 5.w),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              mainAxisSize: MainAxisSize.max,
              children: [
                Row(
                  children: [
                    //左
                    SizedBox(
                      width: 80.w,
                      height: 80.h,
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [Text("￥${Tools.formatNumber(item['money'])}", style: const TextStyle(fontSize: 22, fontWeight: FontWeight.w700, color: Color.fromRGBO(210, 152, 64, 1))), Text(item['useLimit'] == 0 ? '无门槛' : '满${Tools.formatNumber(item['useLimit'])}元可使用', style: const TextStyle(fontSize: 10, fontWeight: FontWeight.w300, color: Color.fromRGBO(210, 152, 64, 1)))],
                      ),
                    ),
                    //中
                    Container(
                      height: 80.h,
                      width: 170.w,
                      margin: EdgeInsets.fromLTRB(10.w, 0.w, 20.w, 0.w),
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.spaceAround,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(item['title'], style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w700, color: Color.fromRGBO(251, 241, 216, 1))),
                          Text(goodTypeValueString(item['goodsType']), style: const TextStyle(fontSize: 10, fontWeight: FontWeight.w300, color: Color.fromRGBO(251, 241, 216, 1))),
                          Text(item['useDate'] ?? '', style: const TextStyle(fontSize: 10, fontWeight: FontWeight.w300, color: Color.fromRGBO(251, 241, 216, 1))),
                        ],
                      ),
                    ),
                  ],
                ),

                //右【按钮】

                Expanded(
                  child: Container(
                    margin: EdgeInsets.only(right: 8.w),
                    child: Column(
                      children: [
                        SizedBox(
                            height: 30,
                            child: TextButton(
                              style: ButtonStyle(
                                backgroundColor: WidgetStateProperty.all(Tools.fromHex("#F83F2D")),
                                side: WidgetStateProperty.all(const BorderSide(color: Color.fromRGBO(251, 241, 216, 1), width: 1.0)),
                              ),
                              onPressed: () {
                                controller.receiveRedPack(item['redPacketId']);
                              },
                              child: const Text(
                                '立即领取',
                                style: TextStyle(fontSize: 10, fontWeight: FontWeight.w300, color: Colors.white),
                              ),
                            )),
                      ],
                    ),
                  ),
                )
              ],
            )),
      ],
    );
  }

  //商品 0-所有商品 1-部分商品 2-指定分类 3-指定品牌

  String goodTypeValueString(int type) {
    switch (type) {
      case 0:
        return '全场商品';
      case 1:
        return '指定商品';
      case 2:
        return '指定分类';
      case 3:
        return '指定品牌';
      default:
        return '全场商品';
    }
  }
}
